<template>
  <div class="activity">
    <activityForm
      :clumnData="clumnData"
      :rowData="rowData"
      :countNum="countNum"
      @searchData="searchData"
      @selectData="selectData"
      @removeData="removeData"
      @addData="addData"
      @changePage="changePage"
    ></activityForm>
  </div>
</template>
<script>
import activityForm from "../../components/components_wxq/marketActivityForm.vue";
import storage from "../../utils/storage";
import { initActivity, setActivity, delActivity } from "../../utils/api/marke";
export default {
  name: "activityPage",
  components: {
    activityForm,
  },
  data() {
    return {
      countNum: 20,
      nowPage: 1,
      clumnData: [
        { name: "typeName", lable: "类型", width: 50 },
        { name: "title", lable: "标题", width: 140 },
        { name: "budget", lable: "预算", width: 80 },
        { name: "target", lable: "目标", width: 80 },
        { name: "result", lable: "结果", width: 80 },
        { name: "startTime", lable: "开始日期", width: 100 },
        { name: "endTime", lable: "结束日期", width: 100 },
        { name: "username", lable: "创建人", width: 80 },
        { name: "createTime", lable: "创建时间", width: 160 },
      ],
      rowData: [],
    };
  },
  methods: {
    //查询
    searchData(str) {
      let key = str;
      console.log(key);

      setActivity(key).then((data) => {
        console.log(data);
        this.rowData = data.data.data.marketingCampaign;
        this.countNum = data.data.data.count;
      });
    },
    // 跳转修改页面
    selectData(obj) {
      this.$router.push({
        name: "addActivityPage",
        params: {
          objData: {
            H: "修改活动",
            data: {
              ...obj,
            },
          },
        },
      });
    },
    // 删除该项
    removeData(obj) {
      let id = obj.id;
      console.log(id);
      this.$confirm("此操作将永久删除该活动, 是否继续?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          delActivity(id).then((data) => {
            console.log(data);
            if (data.data.code == 200) {
              this.$message({
                type: "success",
                message: "删除成功!",
              });
              if (this.rowData.length === 1) {
                this.nowPage--;
              }
              this.initTable();
            }
          });
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消删除",
          });
        });
    },
    // 跳转新增活动页面
    addData() {
      let objData = this.$router.push({
        name: "addActivityPage",
        params: {
          objData: {
            H: "修改活动",
          },
        },
      });
    },
    // 页码变化
    changePage(num) {
      console.log(num);
      this.nowPage = num;
      this.initTable();
    },
    //表格初始化请求
    initTable() {
      initActivity(this.nowPage).then((data) => {
        console.log(data);
        this.rowData = data.data.data.marketingCampaign;
        this.countNum = data.data.data.count;
      });
    },
  },
  computed: {},
  watch: {},
  created() {
    this.initTable();
  },
};
</script>
<style lang="less" scoped>
.activity {
  padding: 20px;
}
</style>
